<style>
	label{
		display: block;
		font-weight: bold;
	}
	input.text { 
		margin-bottom:12px; 
		width:85%; 
		padding: .4em; 
	}
</style>
<script type="text/javascript">
$(document).ready(function() {
	$("#completed").selectmenu({ width:210 });
	$("#status").selectmenu({ width:210 });
});
$("#form_upsert_task").validationEngine();
</script>

<div id="dialog-task" title="Create or edit task">
	<form id="form_upsert_task" class="modal" METHOD="POST" action="<?= base_url() ?>index.php/tasks_controller/save">
	 <div class="container_12">	
		<div class="grid_6">
			<label for="subject">Subject</label>
			<input type="text" name="subject" id="subject" value="" class="text ui-widget-content ui-corner-all validate[required]"/>
		</div>
		<div class="grid_6">
			<label for="description">Description</label>
			<input type="text" id="description" name="description" id="description" rows="5" cols="50" class="text ui-widget-content ui-corner-all validate[required]"></textarea>
		</div>
		<div class="grid_6">
				<label for="status">Status</label>
			<select name="status" id="status" class="text ui-widget-content ui-corner-all">
				<option value="0">Open</option>
				<option value="1">In Progress</option>
				<option value="2">Resolved</option>
			</select>
		</div>
		<div class="grid_6">
			<label for="priority">Priority</label>
			<input type="text" name="priority" id="priority" value="" class="text ui-widget-content ui-corner-all validate[required]"/>
		</div>
		<div class="grid_6">
		<label for="completed">% Completed</label>
		<select id="completed" class="text ui-widget-content ui-corner-all">
		    <option value="0">0</option>
			<option value="10">10</option>
			<option value="20">20</option>
			<option value="30">30</option>
			<option value="40">40</option>
			<option value="50">50</option>
			<option value="60">60</option>
			<option value="70">70</option>
			<option value="80">80</option>
			<option value="90">90</option>
			<option value="100">100</option>
		</select>
		</div>
		<div class="grid_6">
			<label for="estimated_hours">Estimated Hours</label>
			<input type="text" name="estimated_hours" id="estimated_hours" value="" class="text ui-widget-content ui-corner-all" />
		</div>
		<div class="grid_6">
			<label for="worked_hours">Worked Hours</label>
			<input type="text" name="worked_hours" id="worked_hours" value="" class="text ui-widget-content ui-corner-all" />
		</div>
		<div class="grid_6">
			<label for="sprint">Sprint</label>
			<input type="text" name="sprint" id="sprint" value="" class="text ui-widget-content ui-corner-all">
			<input type="hidden" name="sprint_id" id="sprint_id" value=""/>
		</div>
		<div class="grid_6" id="assigned_to_div">
		<p>
			<label for="assigned_to" id="assigned_to_label">Assigned to</label>
			<select name="assigned_to" id="assigned_to"></select>
			<input type="hidden" name="assigned_to_id" id="assigned_to_id" value=""/>
		</p>

	 </div>
	</form>
	</div>
</div>
